<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
        <script src="https://cdn.jsdelivr.net/npm/vue"></script>
        <div id="app">
            <ul>
                <li v-for="(f,index) of vegetables">
                   {{index+1}}-{{f.name}}-{{f.price}}
                </li>
            </ul>
            <ul>
                    <li v-for="(u,key) in users">
                      {{key}}-{{u}}
                    </li>
                </ul>
        </div>
        <script>
                var app=new Vue({
                    el:'#app',       
                    data:{
                        age:28,
                        vegetables:[
                        {name:'tomato',price:2},
                        {name:'potato',price:1},
                        {name:'needle mushroom',price:5},
                        ],
                        users:{
                            userName:"熊超",
                            passWord:123456,
                            telephon:13615902623,
                        }
                            
                        
                    },
                    computed:{
                       
                    }
                })
            </script>
</body>
</html>